<template>
    <div class="pages">
        <van-sticky>
            <div class="header">
                <div class="fls" @click="$router.back(-1)">
                    <img src="../../../static/images/icon-back.png" alt="">
                </div>
                <div class="centern">商户划拨</div>
                <div class="fls"></div>
            </div>
        </van-sticky>
        <div class="interngs">待划拨商户(2)</div>
        <div class="ibodys">
            <div class="ibodyheade">
                <div class="treeng">商户名称</div>
                <div class="treeng">业务经理</div>
                <div class="treeng">所属团队</div>
            </div>
            <div class="intbtwo" v-for="(item,index) in 5" :key="index">
                <div class="treeng">
                    <div class="inteb">一家拉面</div>
                </div>
                <div class="treeng">
                    <div class="incoengt">张三</div>
                </div>
                <div class="treeng">
                    <div class="intebsd">客似云来</div>
                </div>
            </div>
        </div>
        <div class="interngs">划拨对象</div>
        <div class="intenseyrb" @click="intebrg()">
            <div class="zuobian">请选择划拨对象</div>
            <div class="youbian">
                <img src="../../../static/images/icon-arrow-black.png" alt="">
            </div>
        </div>
    </div>
</template>

<script>
export default {
    beforeCreate () {
        document.querySelector('body').setAttribute('style', 'background:#f5f5f5')
    },
    data(){
        return{

        }
    },
    methods:{
        intebrg(){
            this.$router.push({ name: "transfer_data" });
        }
    }
}
</script>

<style scoped>
    .pages{
        width: 100%;
    }
    .header{
        width: 100%;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 16px;
        box-sizing: border-box;
        background: #3288FF;
    }
    .header>.fls{
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .header>.fls>img{
        width: 100%;
        height: 100%;
    }
    .centern{
        color: #FFFFFF;
        font-family: OPPOSans;
        font-weight: medium;
        font-size: 17px;
        letter-spacing: 0px;
    }
    .interngs{
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        padding: 0 16px;
        box-sizing: border-box;
        color: #333333;
        font-family: OPPOSans;
        font-weight: regular;
        font-size: 15px;
        letter-spacing: 0px;
    }

    .ibodys{
        width: 100%;
        padding: 0 16px 16px 16px;
        box-sizing: border-box;
        background: #FFFFFF;
    }
    .ibodyheade{
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #FFFFFF;
        padding: 0 8px;
        box-sizing: border-box;
    }
    .treeng{
        width: 32.33%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #333333;
        font-family: OPPOSans;
        font-weight: regular;
        font-size: 16px;
    }
    .treeng:nth-child(1){
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
    .treeng:nth-child(2){
        width: 32%;
    }
    .treeng:nth-child(3){
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .intbtwo{
        width: 100%;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #EEF5FF;
        padding: 0 8px;
        box-sizing: border-box;
        margin-bottom: 16px;
    }
    .intbtwo:last-child{
        margin-bottom: 0 !important;
    }

    .inteb{
        width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        word-break: break-all;
    }
    .incoengt{
        width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        word-break: break-all;
        text-align: center;
    }
    .intebsd{
        width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        word-break: break-all;
        text-align: right;
    }

    .intenseyrb{
        width: 100%;
        height: 56px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 16px;
        box-sizing: border-box;
        background: #FFFFFF;
    }
    .zuobian{
        color: #4F4F4F;
        font-family: OPPOSans;
        font-weight: regular;
        font-size: 16px;
        letter-spacing: 0px;
    }
    .youbian{
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .youbian>img{
        width: 100%;
        height: 100%;
    }
</style>